<template>
	<gui-page ref="guiPage" :customHeader="true">
		<!-- 导航 -->
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" :title="$t('taskManagement.taskDetails')" @clickLeftBack="clickLeftBack"
				@clickRight="clickRight" scanType="1" :titles="$t('taskManagement.operationLog')"></nav-bar-custom>
		</template>

		<template v-slot:gBody>
			<view class="page-auto-noheight paddingbottom">
				<!-- 调拨单信息 -->
				<view class="custom-form-card" style="margin:10rpx">
					<view class="custom-card-title">
						<text class="title-line"></text>
						{{ $t('taskManagement.taskDetailsInfor') }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.taskNo')
							}}：</text>{{ data.inforDetails.taskCode }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.taskType')
							}}：</text>{{ data.inforDetails.businessTaskTypeName }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('mexico.scanType')
								}}：</text>{{ data.inforDetails.scanType }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.agvNo')
								}}：</text>{{ data.inforDetails.robotCode }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.palletNo')
								}}：</text>{{ data.inforDetails.cartonNo }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.palletType')
								}}：</text>{{ data.inforDetails.cartonType }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.transportedQty')
								}}：</text>{{ data.inforDetails.qty }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.priority')
								}}：</text>{{ data.inforDetails.initPriority }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.pick-upLocation')
							}}：</text>{{ data.inforDetails.fromLocationName }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.unloadingPosition')
							}}：</text>{{ data.inforDetails.toLocationName }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.unloadingPositionQty')
								}}：</text>{{ data.inforDetails.existQty }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('distributedEnter.materialCode')
							}}：</text>{{ data.inforDetails.materialCode }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('distributedEnter.materialName')
								}}：</text>{{ data.inforDetails.materialName }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('finishedInventory.creationTime')
							}}：</text>{{ data.inforDetails.createTime }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.completionTime')
							}}：</text>{{ data.inforDetails.taskCompleteTime }}
					</view>
				</view>
				<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-margin-top"
					style="margin-top:15rpx">
					<view class="gui-title-line"></view>
					<text class="gui-primary-text gui-h6" style="padding-left:50rpx; padding-right:50rpx;">{{
						$t('taskManagement.taskDetailsInfor') }}</text>
					<view class="gui-title-line"></view>
				</view>
				<uni-card class="element-auto gui-margin-top card-my" style="width:100%">
					<view class="element-auto" style="height: 300rpx">
						<zb-table :columns="data.column1" :stripe="true" @rowClick="rowClick" :border="true"
							:data="tableData.list" @customLook="customBtnFn" :cell-style="cellStyle"
							:cell-header-style="cellHeaderStyle">
						</zb-table>
					</view>
				</uni-card>
				<!-- 底部操作栏 -->
				<view class="page-bottom-box bottom-postion">
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="submit"
						v-if="data.inforDetails.taskStatusStr == '创建'">
						{{ $t('calendar.submit') }}
					</view>
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="cancel"
						style="background-color: #C8C9CC"
						v-if="data.inforDetails.taskStatusStr != '创建' && data.inforDetails.taskStatusStr != '已完成' && data.inforDetails.taskStatusStr != '已取消'">
						{{ $t('calendar.cancel') }}
					</view>
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="deletes"
						style="background-color: #f56c6c" v-if="data.inforDetails.taskStatusStr == '创建'">
						{{ $t('slottedAsh.delete') }}
					</view>
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="changDestination"
						style="background-color: #e6a23c"
						v-if="data.inforDetails.taskStatusStr != '创建' && data.inforDetails.taskStatusStr != '已完成' && data.inforDetails.taskStatusStr != '已取消'">
						{{ $t('taskManagement.changDestination') }}
					</view>
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="changePriority"
						style="background-color: #c3ac33"
						v-if="data.inforDetails.taskStatusStr != '创建' && data.inforDetails.taskStatusStr != '已完成' && data.inforDetails.taskStatusStr != '已取消'">
						{{ $t('taskManagement.changePriority') }}
					</view>
				</view>
				<uni-popup ref="popup" type="center">
					<view class="input-dialog-box"
						style="padding: 40rpx 20rpx 20rpx 20rpx;border-radius: 22rpx;width: 600rpx;">
						<uni-icons class="popup-close-icons" type="closeempty" color="#9C9C9C" size="26"
							@click="closePopup"></uni-icons>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('Common.pointSeq') }}：</text>{{ data.popupInfo.seq }}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('translationImage.process') }}：</text>{{
								data.popupInfo.processCode }}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('multilingual.productionLine') }}：</text>{{
								data.popupInfo.lineCode }}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('mexico.position') }}：</text>{{
								data.popupInfo.locationCode }}
						</view>

						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('taskManagement.operationType') }}：</text>{{
								data.popupInfo.operation }}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('taskManagement.goodsType') }}：</text>{{
								data.popupInfo.wareType}}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('distributedEnter.qty') }}：</text>{{
								data.popupInfo.qty}}
						</view>
						<view class="custom-card-itemOne">
							<text class="item-info-title">{{ $t('taskManagement.destinationsQty')
								}}：</text>{{ data.popupInfo.currentQty }}
						</view>
					</view>
				</uni-popup>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
import { navigate, navigateBack } from '@/utils/routerSkip.js';
import { reactive, ref, onMounted, computed, watch, toRaw, toRef } from 'vue';
import { getDataDictionaryFn, pitchOnFn, sortClass } from '@/utils/index.js'
import { getTaskInfo, getTaskStepByTaskCode,delTaskByTaskCode,cancelTaskByTaskCode ,submitTaskByTaskCode} from '@/api/api.js'
import superweiCombox from '@/components/superweiCombox';
import tableColor from '@/hooks/tableColor.js'
import storageBin from '@/components/storageBin.vue'
import { basPdaOperationLogFn } from '@/utils/index.js';
import { OPERATION_LOOK,OPERATION_DEL,OPERATION_CANCEL,OPERATION_COMMIT } from '@/constant/index.js'
import { useStore } from "vuex";
import { onBackPress } from '@dcloudio/uni-app';
import pdaScan from '@/hooks/pdaScan.js'

//国际化引入
import { useI18n } from 'vue-i18n';
const { t } = useI18n();

let store = useStore()
const { scan } = pdaScan()

components: {
	storageBin,
		superweiCombox
}
let { tableData } = tableColor();
const { cellStyle, cellHeaderStyle } = tableColor();
const props = defineProps({
	id:String
})
let popup = ref(null)
let inputDialog = ref(null)

const data = reactive({
	inforDetails: {},
	column1: [{
		name: 'age',
		type: 'ailibtn',
		label: t('translationImage.operation'),
		scanValue: '',
		fixed: true,
		width: 80,
	}
		, {
		name: 'seq',
		label: t('Common.pointSeq'),
		scanValue: '',
		width: 80,
	}
		,
	{
		name: 'processCode',
		label: t('translationImage.process'),
		width: 110,
		emptyString: '--'
	}, {
		name: 'lineCode',
		label: t('multilingual.productionLine'),
		width: 140,
	},
	{
		name: 'locationCode',
		label: t('mexico.position'),
		width: 140,
		emptyString: '--'
	}

		, {
		name: 'code',
		label: t('Common.pointPosition'),
		scanValue: '',
		width: 140,
	}
		,
	{
		name: 'operation',
		label: t('taskManagement.operationType'),
		width: 150,
		emptyString: '--'
	}, {
		name: 'wareType',
		label: t('taskManagement.goodsType'),
		width: 160,
		emptyString: '--'
	},
	{
		name: 'qty',
		label: t('distributedEnter.qty'),
		width: 80,
		emptyString: '--'
	},
	{
		name: 'currentQty',
		label: t('taskManagement.destinationsQty'),
		width: 140,
		emptyString: '--'
	}],
	popupInfo: {}, //当前行的弹窗信息
})

onMounted(() => {
	taskInfo();
	getTableData()
})

data.barcodeList = computed(() => {
	// return store.state.transferredList
})

const taskInfo = () => {
	getTaskInfo({
		taskCode: props.id,
		beginTime: '',
		endTime: '',
		agvCode: "",
		robotTaskCode: '',// 任务类型
		taskStatus: data.selectId,// 任务状态
		taskType: '',// 任务类型，一般是搬运
		fromProcessCode: '',//取货地工序code
		fromLocationCode: '',//取货地位置code
		fromLineCode: '',//取货地线别code
		toProcessCode: '',//放货地工序code
		toLineCode: '',//放货地线别code
		toLocationCode: '',//放货地位置code
		materialCode: '',//物料号 多个之间用; 隔开
		cartonCode: '',//托盘号
		cartonType: '',//托盘类型 WoodCarton48  48 英寸木托盘 / WoodCarton60  60 英寸木托盘 
		priority: '',//任务优先级
		pageSize: 20,
		pageNo: 1
	}).then(res => {
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = 'AGV任务管理--任务详情'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_LOOK,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			data.inforDetails = res.result.items[0]
		} else {
			uni.showToast({ title: res.message, icon: 'none' })
		}
	})
}

// 表格获取
const getTableData = async() => {
	await getTaskStepByTaskCode({
		taskCode: props.id
	}).then(res => {
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = 'AGV任务管理--任务详情'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_LOOK,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			tableData.list = res.result
		} else {
			uni.showToast({ title: res.message, icon: 'none' })
		}
	})
}

// 提交 取消 删除 变更目的地和优先级
const submit = () => {
	let parmes={
		taskCode:props.id
	}
	submitTaskByTaskCode(parmes).then(res=>{
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = 'AGV任务管理'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType:  OPERATION_COMMIT,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			uni.showToast({ title:('taskManagement.submitSucceeded'), icon: 'none' })
			uni.navigateBack({
				delta: 1
			});
		} else {
			uni.showToast({ title: res.message, icon: 'none' })
		}
	})
}
const cancel = () => {
	let parmes = {
		taskCode: props.id
	}
	cancelTaskByTaskCode(parmes).then(res => {
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = 'AGV任务管理-任务详情'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_CANCEL,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			uni.showToast({ title: t('taskManagement.cancelSucceeded'), icon: 'none' })
			uni.navigateBack({
				delta: 1
			});
		} else {
			uni.showToast({ title: res.message, icon: 'none' })
		}
	})
}
const deletes = () => {
	let parmes = {
		taskCode: props.id
	}
	delTaskByTaskCode(parmes).then(res => {
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = 'AGV任务详情'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_DEL,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			uni.showToast({ title: ('taskList.deleteSucceededt'), icon: 'none' })
			uni.navigateBack({
				delta: 1
			});
		} else {
			uni.showToast({ title: res.message, icon: 'none' })
		}
	})
}
const changDestination = () => {
	navigate({
		url: `/pages/IOTScanning/changeOfDestination?id=${props.id}`
	})
}
const changePriority = () => {
	navigate({
		url: `/pages/IOTScanning/changePriority?id=${props.id}`
	})
}
// 跳转画面 日志
const clickRight = () => {
	navigate({
		url: `/pages/IOTScanning/taskDetailsLogs?id=${props.id}`
	})
}
// 表格相关事件
const rowClick = () => {

}
const customBtnFn = (item, index) => {
	console.log(item, index)
	data.popupInfo = item;
	popup.value.open()
}
const closePopup = () => {
	popup.value.close()
}
// 返回

onBackPress((options) => {
	if (options.from == 'backbutton') {
		navBackCheck()
		return true;
	}
})
//导航栏左侧返回
const clickLeftBack = () => {
	navBackCheck()
}
const navBackCheck = () => {
	uni.navigateBack({
		delta: 1
	});
}
</script>

<style scoped lang="scss"></style>